<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更改密码</title>
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-form.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
    <script type="text/javascript" src="js/sweetalert-dev.js"></script>
    <link rel="stylesheet" type="text/css" href="css/sweetalert.css"/>

    <style type="text/css">
        body,html{
            width: 100%;
            height: 100%;
            margin:0px;
            padding:0px;
            font-size: 17px;

        }

        body{
            background: url("img/backgound1.jpg") center;

        }

        .header{
            text-align: center;
            padding-top: 10%;
            color: #5cb85c;

        }
        label{
            color: #67b168;
        }
        #container{
            margin-left: 33%;

        }
        .btn{
            font-size: 17px;

        }
        form{
            padding: 10% 10%;
            width: 50%;
        }


    </style>

</head>
<script>
    $(document).ready(function () {

        
        // 登录按钮事件
        $("#update").click(function () {
            var pswd1 = $("#loginPassword").val();
            var pswd2 = $("#loginPassword2").val();
            if(pswd1 != pswd2){

                swal({
                    title: "注册失败, 前后密码不一致",
                    text: "5秒后自动消失",
                    timer: 5000,
                    type:"error",
                    showConfirmButton: true
                });

            }
            else{
            $("#updateForm").ajaxSubmit({
                url: "./update.do",
                type:"POST",
                dataType:"json",

            success:function(data){
                    if(data == '1')
                        swal({
                            title: "修改成功！",
                            text: "5秒后自动消失",
                            timer: 5000,
                            type:"success",
                            showConfirmButton: true
                        });
                    else if(data == '0')
                        swal({
                            title: "修改失败！用户不存在",
                            text: "5秒后自动消失",
                            timer: 5000,
                            type:"error",
                            showConfirmButton: true
                        });
                    else
                        swal({
                            title: "修改失败！",
                            text: "5秒后自动消失",
                            timer: 5000,
                            type:"error",
                            showConfirmButton: true
                        });
            }
            });}
        });
    });
</script>
<body>
    <!--<div>欢迎来到图书馆</div>-->
    <!--<form class="form-horizontal" id="loginForm" method="post">-->
        <!--<input type="text" name="loginName" id="loginName">-->
        <!--<input type="text" name="password" id="password">-->

        <!--<input type="button" value="修改密码" name="update" id="update">-->
    <!--</form>-->


    <div class="header">
        <div class="col-xs-offset-2 col-xs-8">
            <h1>欢迎来到图书馆</h1>
        </div>
    </div>
    <div class="container-fluid" id="container">
        <form id="updateForm">
            <div class="form-group">
                <label for="loginName">登录名</label>
                <input type="text" class="form-control" id="loginName" name="loginName" placeholder="请输入登录名">
            </div>
            <div class="form-group">
                <label for="loginPassword">新密码</label>
                <input type="password" class="form-control" id="loginPassword" name="loginPassword" placeholder="请输入密码">
            </div>
            <div class="form-group">
                <label for="loginPassword2">再次输入</label>
                <input type="password" class="form-control" id="loginPassword2" name="loginPassword2" placeholder="请再次输入密码">
            </div>
            <div class="form-group" style="margin-top: 30px">
                <div class="col-xs-offset-1 col-xs-6">
                    <input type="button" value="修改密码" name="update" id="update" class="btn">
                </div>
                
            </div>
        </form>
    </div>

</body>
</html>